import React, {
    useCallback,
    useEffect,
    useLayoutEffect,
    useMemo,
    useState
} from "react";
import {connect, useDispatch} from "react-redux";
import intl from "react-intl-universal";
import moment from "moment";
import { Radio, DatePicker, TimePicker, Collapse, Checkbox, Spin, Select, Calendar, Popover, message, ConfigProvider } from "antd";
import axiosMethod from "../../../../../common/axios/index";
import Modal from "../../../../../common/component/modal";
import Empty from "../../../../../common/component/empty";
import zhCN from "antd/es/locale/zh_CN";
import { getRangeDate, getRangeMonth, getDateType, getDateWeek, constructionDate } from "../../../../../common/util/index";
import "./index.scss";
import Scrollbars from "react-custom-scrollbars";
import Week from "./week";
import Month from "./month";
import Day from "./day";
import Year from "./year";

const {Option} = Select;
const weekNoList = [ "星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
const timeLineList = [];
for(let i = 0; i <= 24; i++){
    timeLineList.push(`${i<10?"0"+i:i}:00`);
}
function MySchedule(props){
    let {
        sysAddrInfo,
        currentIdentity,
        skinInfo,
        termInfo,
        userInfo,
        changeVisible,
        scheduleType,
        chooseDate,
        changeMonthSchedule,
        refresh
    } = props;
    const dispatch = useDispatch();
    const [loadVisible, setLoadVisible] = useState(false);
    const [scheduleList, setScheduleList] = useState([]);
    const [dayDate, setDayDate] = useState("");
    const [termWeekList, setTermWeekList] = useState([]);
    const [currentWeek, setCurrentWeek] = useState([]);
    const [dateIndex, setDateIndex] = useState(0);
    const [maxIndex, setMaxIndex] = useState(0);
    const [timeInfo, setTimeInfo] = useState({});

    const [termMonthList, setTermMonthList] = useState([]);

    const getScheduleList = useCallback(()=>{  //获取时间段内所有个人日程
        // let dateRange = getRangeDate(timeInfo.startDate, timeInfo.endDate);
        axiosMethod({ 
            type: "get",
            url: "api/schedule/list/person",
            body: {
                eduId: userInfo.eduId,
                userId: userInfo.userId,
                userType: userInfo.userType,
                startTime: timeInfo.startDate,
                endTime: timeInfo.endDate,
            },
            callback: function(res){
                setLoadVisible(false);
                if(!Array.isArray(res)){
                    setScheduleList([]);
                    return;
                }
                setScheduleList(res);
                
            }
        });
    }, [timeInfo, userInfo]);
    const getAllMonthList = useCallback(()=>{  //获取本学期所有月信息
        let info = {
            startDate: `${moment(chooseDate).startOf("month").format("YYYY-MM-DD")}`,
            endDate: `${moment(chooseDate).endOf("month").format("YYYY-MM-DD")}`,
        }
        setTimeInfo(info);
    }, [chooseDate]);
    const getAllYearList = useCallback(()=>{  //获取年份所有日程
        let info = {
            startDate: `${moment(chooseDate).startOf("year").format("YYYY-MM-DD")}`,
            endDate: `${moment(chooseDate).endOf("year").format("YYYY-MM-DD")}`,
        }
        setTimeInfo(info);
    }, [chooseDate]);
    const changeDay = useCallback((value)=>{
        value = dayDate? moment(dayDate): value;
        axiosMethod({ 
            type: "get",
            url: "/api/common/school/term/date/week/info",
            body: {
                eduId: userInfo.eduId,
                userId: userInfo.userId,
                userType: userInfo.userType,
                date: value.format("YYYY-MM-DD")
            },
            callback: function(res){
                setDayDate("");
                if(!res){
                    setTimeInfo({
                        weekNo: "",
                        weekText: weekNoList[value.weekday()],
                        dayText: value.format("YYYY-MM-DD"),
                        startDate: value.format("YYYY-MM-DD"),
                        endDate: value.format("YYYY-MM-DD")
                    })
                    return;
                }
                setTimeInfo({
                    weekNo: res.weekNo,
                    weekText: weekNoList[value.weekday()],
                    dayText: value.format("YYYY-MM-DD"),
                    startDate: value.format("YYYY-MM-DD"),
                    endDate: value.format("YYYY-MM-DD")
                })
            }
        });
        
    }, [dayDate, userInfo]);
    const showDayType = useCallback((value)=>{
        setDayDate(value);
        setCurrentType('day');
        // changeDay(moment(value));
    }, []);
    useLayoutEffect(()=>{
        setLoadVisible(true);
        if(scheduleType === "week"){
            // getAllWeekList();
            setLoadVisible(false);
        } else if(scheduleType === "month"){
            getAllMonthList();
        } else if(scheduleType === "year"){
            getAllYearList();
        } else {
            changeDay(moment(constructionDate("", 3)));
        }
    }, [scheduleType, refresh, chooseDate, getAllMonthList]);
    useEffect(()=>{
        if(!timeInfo.startDate){
            return;
        }
        setLoadVisible(true);
        getScheduleList();
        window._getScheduleList = getScheduleList;
    }, [timeInfo, getScheduleList]);
    console.log(scheduleList, 'scheduleList')
    return (
        <Spin spinning={loadVisible} tip="加载中...">
        {
            scheduleType === "month"?
            <Month chooseDate={chooseDate} scheduleList={scheduleList} {...props} />:
            scheduleType === "year"?
            <Year changeMonthSchedule={changeMonthSchedule} year={moment(chooseDate).get("year")} scheduleList={scheduleList} />:
            // <Day scheduleList={scheduleList} getScheduleList={getScheduleList}  />
            <Week {...props} />
        }
        </Spin>
    )
}
const mapProps = (state) => {
    return {
        userInfo: state.userInfo,
        sysAddrInfo: state.sysAddrInfo,
        identityList: state.identityList,
        currentIdentity: state.currentIdentity,
        skinInfo: state.skinInfo,
        sysInfo: state.sysInfo,
        termInfo: state.termInfo
    }
}
export default connect(mapProps)(MySchedule);